// ClientAgreementForm x-component-props 表达式模板
export const ComponentPropsExpressions = {
  // 输入框点击事件表达式
  inputClick: {
    // 打开对话框
    openDialog: {
      customer: `{{(ctx, deps) => {
  const useDialogInstances = deps.useDialogInstances
  const dialog = useDialogInstances().get('客户')
  dialog.open(ctx)
}}}`,
      agreement: `{{(ctx, deps) => {
  const useDialogInstances = deps.useDialogInstances
  const dialog = useDialogInstances().get('客户协议')
  dialog.open(ctx)
}}}`,
    },
    // 带验证的打开对话框
    openDialogWithValidation: `{{(ctx, deps) => {
  const agreementName = ctx.form.getValuesIn('agreementName')
  const {isMultiAgreet} = deps.getStorage('adminQiankunGlobalState') || {}
  if (isMultiAgreet && !agreementName) {
    deps.antdMsg(ctx.createT('请选择客户协议'), 'error')
    return
  }
  const useDialogInstances = deps.useDialogInstances
  const dialog = useDialogInstances().get('客户')
  dialog.open(ctx)
}}}`,
    // 表单验证
    formValidation: `{{(ctx, deps) => {
  const value = ctx.value
  if (!value) {
    deps.antdMsg(ctx.createT('请填写必要信息'), 'error')
    return
  }
  // 继续执行其他逻辑
}}}`,
  },

  // 对话框确认事件表达式
  dialogConfirm: {
    // 基础确认
    basic: `{{(ctx, deps) => {
  console.log('Dialog confirmed:', ctx)
  // 在这里添加确认后的逻辑
}}}`,
    // 带数据处理的确认
    withDataProcessing: `{{(ctx, deps) => {
  const { selectedRows, form } = ctx
  if (selectedRows && selectedRows.length > 0) {
    const selectedData = selectedRows[0]
    form.setValues({
      selectedCode: selectedData.code,
      selectedName: selectedData.name
    })
  }
  console.log('Dialog confirmed with data:', selectedRows)
}}}`,
    // 带验证的确认
    withValidation: `{{(ctx, deps) => {
  const { selectedRows } = ctx
  if (!selectedRows || selectedRows.length === 0) {
    deps.antdMsg(ctx.createT('请选择一条记录'), 'error')
    return false
  }
  return true
}}}`,
  },

  // 表格请求表达式
  tableRequest: {
    // 客户列表请求
    customerList: `{{async (ctx, deps) => {
  const { request } = deps
  const { params } = ctx
  const res = await request({
    uri: '/api/tenant/agreement/customer/list',
    params: {
      ...params,
    },
    method: 'POST',
  })
  return res
}}}`,
    // 协议列表请求
    agreementList: `{{async (ctx, deps) => {
  const { request } = deps
  const { params } = ctx
  const res = await request({
    uri: '/api/tenant/agreement/listAgreement',
    params: {
      ...params,
    },
    method: 'POST',
  })
  return res
}}}`,
    // 带条件过滤的请求
    withFilter: `{{async (ctx, deps) => {
  const { request } = deps
  const { params } = ctx
  const formValues = ctx.form?.getValues() || {}
  
  const res = await request({
    uri: '/api/tenant/agreement/list',
    params: {
      ...params,
      ...formValues,
    },
    method: 'POST',
  })
  return res
}}}`,
  },

  // 表格选择变更表达式
  tableSelectionChange: {
    // 单选
    single: `{{(ctx, deps) => {
  const { selectedRows, form } = ctx
  const { name, code } = selectedRows[0] || {}
  form.setValues({
    agreementCode: code,
    agreementName: name
  })
}}}`,
    // 多选
    multiple: `{{(ctx, deps) => {
  const { selectedRows, form } = ctx
  const codes = selectedRows.map(row => row.code)
  const names = selectedRows.map(row => row.name)
  form.setValues({
    selectedCodes: codes,
    selectedNames: names
  })
}}}`,
    // 带验证的选择
    withValidation: `{{(ctx, deps) => {
  const { selectedRows, form } = ctx
  if (selectedRows.length > 1) {
    deps.antdMsg(ctx.createT('只能选择一条记录'), 'warning')
    return
  }
  const { name, code } = selectedRows[0] || {}
  form.setValues({
    agreementCode: code,
    agreementName: name
  })
}}}`,
  },

  // 自定义渲染表达式
  customRender: {
    // 日期范围渲染
    dateRange: `{{(ctx) => {
  const record = ctx.record
  return record.startDate && record.endDate && \`\${record.startDate}~\${record.endDate}\`
}}}`,
    // 状态渲染
    status: `{{(ctx) => {
  const record = ctx.record
  const statusMap = {
    '1': { text: '启用', color: 'green' },
    '0': { text: '禁用', color: 'red' }
  }
  const status = statusMap[record.status]
  return status ? <span style={{ color: status.color }}>{status.text}</span> : record.status
}}}`,
    // 操作按钮渲染
    actions: `{{(ctx) => {
  const record = ctx.record
  return (
    <Space>
      <Button size="small" onClick={() => handleEdit(record)}>编辑</Button>
      <Button size="small" danger onClick={() => handleDelete(record)}>删除</Button>
    </Space>
  )
}}}`,
  },

  // 动态样式表达式
  dynamicStyle: {
    // 基于状态的样式
    statusBased: `{{(ctx) => {
  const record = ctx.record
  return {
    color: record.status === '1' ? '#52c41a' : '#ff4d4f',
    fontWeight: record.important ? 'bold' : 'normal'
  }
}}}`,
    // 基于条件的样式
    conditionBased: `{{(ctx) => {
  const value = ctx.value
  return {
    backgroundColor: value > 100 ? '#f6ffed' : '#fff2e8',
    borderColor: value > 100 ? '#b7eb8f' : '#ffd591'
  }
}}}`,
  },

  // 动态类名表达式
  dynamicClassName: {
    // 基于状态的类名
    statusBased: `{{(ctx) => {
  const record = ctx.record
  return \`table-row \${record.status === '1' ? 'active' : 'inactive'}\`
}}}`,
    // 基于条件的类名
    conditionBased: `{{(ctx) => {
  const value = ctx.value
  return \`form-item \${value ? 'has-value' : 'empty'}\`
}}}`,
  },
}

// 表达式编辑器配置
export const ComponentPropsExpressionConfig = {
  // 可用的变量和函数
  context: {
    ctx: {
      type: 'object',
      description: '当前上下文对象',
      properties: {
        form: {
          type: 'object',
          description: '表单实例',
          methods: [
            'getValuesIn',
            'setValues',
            'getFieldValue',
            'setFieldValue',
            'getValues',
          ],
        },
        record: {
          type: 'object',
          description: '当前记录数据（表格行数据）',
        },
        selectedRows: {
          type: 'array',
          description: '选中的行数据',
        },
        value: {
          type: 'any',
          description: '当前字段值',
        },
        params: {
          type: 'object',
          description: '请求参数（表格请求时）',
        },
      },
    },
    deps: {
      type: 'object',
      description: '依赖注入对象',
      properties: {
        useDialogInstances: {
          type: 'function',
          description: '获取对话框实例',
          usage: 'deps.useDialogInstances().get("对话框名称")',
        },
        getStorage: {
          type: 'function',
          description: '获取本地存储数据',
          usage: 'deps.getStorage("adminQiankunGlobalState")',
        },
        antdMsg: {
          type: 'function',
          description: '显示Antd消息',
          usage: 'deps.antdMsg("消息内容", "error|success|warning")',
        },
        request: {
          type: 'function',
          description: '发送HTTP请求',
          usage:
            'deps.request({ uri: "/api/path", method: "POST", params: {} })',
        },
      },
    },
  },

  // 常用代码片段
  snippets: [
    {
      label: '打开对话框',
      insertText: `const useDialogInstances = deps.useDialogInstances
const dialog = useDialogInstances().get('对话框名称')
dialog.open(ctx)`,
    },
    {
      label: '表单验证',
      insertText: `if (!ctx.value) {
  deps.antdMsg(ctx.createT('请填写必要信息'), 'error')
  return
}`,
    },
    {
      label: '设置表单值',
      insertText: `ctx.form.setValues({
  字段名: 值
})`,
    },
    {
      label: 'API请求',
      insertText: `const { request } = deps
const { params } = ctx
const res = await request({
  uri: '/api/path',
  params: { ...params },
  method: 'POST',
})
return res`,
    },
    {
      label: '表格选择处理',
      insertText: `const { selectedRows, form } = ctx
const { name, code } = selectedRows[0] || {}
form.setValues({
  selectedCode: code,
  selectedName: name
})`,
    },
  ],
}
